<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title></title>
	<style type="text/css">
         /*		
              !importent
              行内样式     1000
              id选择器     100
              类选择器     10
              标签选择器   1
              通配符选择器* 0

         */
        /* 10 + 100 = 110		*/
        .box #sp{
        	background: gold;
        }

       /* 100		*/
        #sp{
            background: yellowgreen;
        }
       /* 10 + 1 + 1 = 12		*/
		.box ul span{
			background: orange;
		}
       /* 10 + 1 = 11		*/
		.box span{
			background: aqua;
		}
        /*	1 + 1 + 1 = 3	*/
		ul li span{
			background: hotpink;
		}
        /* 1  */
		span{
			background: green;
		}
	</style>
</head>
<body>
      <div class="box">
      	  <div>
      	  	   <ul>
      	  	   	   <li>
      	  	   	   	   <span id="sp">金木水火土谁的腿最长</span>
      	  	   	   </li>
      	  	   </ul>
      	  </div>
      </div>
</body>
</html>